.bg-color{
    background:#eee;
}
.mt-150{
    margin-top:150px;
}
body,html{
    height:100%;
}
*{
    margin: 0;
    padding: 0;
    box-sizing:content-box;
}
th {
    text-align: center;
  }
  
  .table>tbody>tr>td {
    vertical-align: middle;
  }
a,
a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
}
.box {
    display:flex;
    width: 100%;
    height: 100%;
    // background: lime;
    .box-left{
        position:relative;
        left:0px;
        top:0px;
        width: 180px;
        height: 100%;
        background:rgb(26, 39, 41);
        color:#eee7e7;
        .left-header{
            height: 40px;
            width: 100%;
            text-align:center;
            background: rgb(8, 235, 223);
            h3{
                line-height:40px;
                margin-top:0;
            }
        }
        .left-main{
            width: 100%;
            height: 30%;
            text-align:center;
            margin-top:10px;
           
            i{
                display:block;
                width: 90px;
                height: 90px;
                margin-top:40px;
                margin-left:40px;
                border-radius:50%;
                background:url(../images/孙燕姿3.jpg)no-repeat center center;
                background-size:100% 100%;
            }
        }
        .left-list{
            text-align:center;
            ul,.one-list{
                margin-top:30px;
                li{
                    margin-top:10px;
                   
                    i{
                        display:inline-block;
                        width: 20px;
                        height: 20px;
                        color:white;
                    }
                    .show-hide{
                        margin-top:5px;
                        display:none; 
                    }
                    ul{
                        margin-top:5px;
                    }
                }
            }
            .border-left{
                border-left:3px solid green;
            }
        }
    }
    .box-right{
        position:relative;
        left:0px;
        top:0px;
        flex:1;
        // background: #3e423f;
        .right-header{
            position: fixed;
            top:0px;
            // left:130px;
            height:40px;
            width: 100%;
            z-index: 10;
            background: rgb(8, 235, 223);
            .p-left{
                width: 20px;
                height: 20px;
                color:white;
                font-size:20px;
                line-height:40px;
                float:left;
                cursor:pointer;
            }
            .p-right{
                width: 20px;
                height: 20px;
                color:white;
                font-size:20px;
                float:right;
                line-height:40px;
                margin-right:20px;
                cursor:pointer;
            }
        }
        .right-nav{
            width: 95%;
            margin-left:30px;
            height: 40px;
            margin-top:40px;
            border-radius:8px;
            border:1px solid rgb(26, 21, 21);
            background:rgba(73, 70, 70,.6);
            .nav-dateil{
                padding-left:10px;
                line-height:40px;
                font-size:18px;
                b{
                    color:rgb(12, 43, 218);
                }
            }
        }
    }
}